import React, { useEffect, useState } from 'react'
import { Space, Table, Tag, Input } from 'antd';
import axios from '../http/request';
import { useAddKey } from '../hooks'

const { Search } = Input;

function hocTable(Com: any, flag = true, url: string, columns: any) {
    return () => {
        const [list, setList] = useState([])

        const onSearch = (val: any) => {
            axios.get(url, {
                params: {
                    val
                }
            }).then(res => {
                setList(useAddKey(res.data.data, "vid"))
            })
        }
        useEffect(() => {
            axios.get(url, {
                params: {
                    val: ''
                }
            }).then(res => {
                setList(useAddKey(res.data.data, "vid"))
            })
        }, [])
        const html = flag ? <Search placeholder="input search text" onSearch={onSearch} enterButton /> : ''
        return <div>
            {html}
            <Table columns={columns} dataSource={list} />
        </div>
    }
}

export {
    hocTable
}